<!-- 护理项目列表页 -->
<template>
    <!-- 表单 -->
    <div class="formBox">
    <t-form ref="form" :data="searchData" label-width="98"
     @reset="subOnReset" @submit="subOnSubmit">
     <t-row>
        <t-col>
          <t-form-item label="名字" name="name">
            <t-input v-model="searchData.name" clearable @clear="headerName"></t-input>
          </t-form-item>
        </t-col>
        <t-col>
          <t-form-item label="状态" name="status">
            <t-select v-model="searchData.status" clearable @clear="headerStatus">
              <t-option v-for="status in STATUS" :key="status.value" :label="status.label" :value="status.value" />
            </t-select>
          </t-form-item>
        </t-col>
        <t-col>
          <t-form-item>
            <t-space size="small">
              <t-button theme="primary" type="submit">查询</t-button>
              <t-button theme="default" variant="base" type="reset">重置</t-button>
              <!-- 下方示例代码，有效，勿删 -->
              <!--<t-button theme="default" @click="submitForm">实例方法提交</t-button>-->
              <!--<t-button theme="default" variant="base" @click="resetForm">实例方法重置</t-button>-->
              <!--<t-button theme="default" variant="base" @click="validateOnly">仅校验</t-button>-->
            </t-space>
          </t-form-item>
        </t-col>
     </t-row>
    </t-form>
    </div>
</template>

<script setup lang="ts">
import { ref} from 'vue';
import {STATUS} from '@/constants/index'

let props=defineProps({
  searchData: {
    type: Object,
    default:()=>{return {}}
  } 
})
let emits=defineEmits(['query'])

let subOnReset=()=>{
  delete props.searchData.name;
  delete props.searchData.status;
  emits('query')
}
let subOnSubmit=()=>{
  emits('query')
}

let headerName=()=>{
  delete props.searchData.name;
  emits('query')
}

let headerStatus=()=>{
  delete props.searchData.status;
  emits('query')
}
</script>